iT邦幫忙

2024 iThome 鐵人賽

DAY 15
0
JavaScript

每天都進步一點!從零開始的JavaScript 與基礎網路知識學習系列 第 15

Day 15 解構賦值 Destructuring Assignment-練習

  • 分享至 

  • xImage
  •  

大家好,我是Karin。今天要來學習的內容是-解構賦值 Destructuring Assignment。
今天要來練習解構賦值的操作及延伸應用。

課程內容來自:彭彭的教學影片
https://www.youtube.com/watch?v=AMwRSPh2G3U&list=PL-g0fdC5RMbqW54tWQPIVbhyl_Ky6a2VI&index=28


複習一下

陣列解構賦值的語法

let arr=[3,4,5];
let[d1,d2,d3]=arr;

陣列解構賦值應用:變數資料交換

let a=1,
let b=2;
[b,a]=[a,b];

物件解構賦值的語法

let obj={x:3,y:4};
let {x,y}=obj;

變數會根據物件成員名稱做對應,x變數對應到物件中的x,y變數對應到物件中的y。

物件解構賦值應用:統整函式的物件參數

若為多參數函數,可以這樣改寫:
使用一個物件(args)來代表多個參數,呼叫時採用物件型式(n1,n2)傳入。

            function add(args){
                console.log(args.n1+args.n2);
            }
            add({n1:3,n2:4});

解構賦值後

            function add({n1,n2}){
                console.log(n1+n2);
            }
            add({n1:3,n2:4})

此處會直接將n1:3,n2:4分別帶入n1,n2中,並進行後續函式中的加法運算並輸出。


上一篇
Day 14 解構賦值 Destructuring Assignment
下一篇
Day 16 其餘運算符號 Rest Operator
系列文
每天都進步一點!從零開始的JavaScript 與基礎網路知識學習30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言